import React from "react";
import styles from './Swipercom.scss';
import { Button, Carousel, Col, Row } from 'antd';
import { LeftOutlined , RightOutlined  } from "@ant-design/icons"
//引入底部组件
class Home extends React.Component{
  constructor(props) {
    super(props);
    this.state = {};
    this.img = undefined
  }
  prev() {
    this.img.prev();
  }
  next() {
    this.img.next();
  }
  render() {

    return (
      <div className={styles.ContentBox}>
        <Row>
          <Col className={styles.center} span={2}><Button className={styles.CarouselIcon} onClick={this.prev.bind(this)} shape="circle" icon={<LeftOutlined  />}/></Col>
          <Col span={20}>
          <Carousel autoplay className={styles.Carousel} ref={dom => { this.img = dom; }}>
            <div><img src='../../../../public/img/logo.png' alt="" /></div>
            <div><img src='../../../../public/img/logo.png' alt="" /></div>
            <div><img src='../../../../public/img/logo.png' alt="" /></div>
            <div><img src='../../../../public/img/logo.png' alt="" /></div>
          </Carousel>
          </Col>
          <Col className={styles.center} span={2}><Button onClick={this.next.bind(this)} shape="circle" icon={<RightOutlined  />}/></Col>
        </Row>
          
      </div>

    );
  }

}
export default Home;

